<template>
    <div>
        <div class="move-box">
            <RiskLeftModule02
                @on-handleNode="clickNode"
                :treeData="treeData"
                :leftHeight="leftHgt"
                :default-expanded-keys="['0']"
                :currentKey="CurrentNodeKey"
            >
                <template slot="ltitle">条目组信息</template>
            </RiskLeftModule02>

            <template v-if="cutInfo === '非动态条目组' || cutInfo === '动态条目组'">
                <RiskRightModule02>
                    <p slot="rtitle">条目组信息</p>
                    <span slot="button" class="layout01-r-slot">
                        <!-- v-authCode.show="B_0031"  -->
                        <!-- v-authCode.show="B_0030" -->
                        <!-- v-authCode.show="B_0027" -->
                        <el-button type="primary" v-authCode.show="B_0031" size="mini" @click="openAddGroupDialog" key="table1-btn1">新增</el-button>
                        <el-button type="danger" v-authCode.show="B_0030" size="mini" @click="handleGroupRemove(-1)" key="table1-btn2"
                            >删除</el-button
                        >
                        <el-button type="primary" v-authCode.show="B_0027" size="mini" @click="handleSearch">查询</el-button>
                    </span>
                    <slot>
                        <el-table
                            :data="groupData"
                            v-table-top="groupPage.currentPage"
                            @selection-change="handleSelectionChange"
                            :header-cell-style="{ background: '#f5f9fc', borderColor: '#d7d7d7', fontSize: '10px', fontWeight: '500' }"
                            :row-class-name="tableRowColor"
                            highlight-current-row
                            highlight-hover-row
                            border
                            size="mini"
                            style="width: 100%"
                            :auto-resize="true"
                            height="calc(100vh - 140px)"
                            :key="groupDataNumKey + 'groupDataNumKey'"
                        >
                            <el-table-column type="selection" width="55" size="mini" fixed="left" :selectable="selectDisabled"> </el-table-column>
                            <el-table-column prop="groupCode" label="分组编码" min-width="100" show-overflow-tooltip> </el-table-column>
                            <el-table-column prop="groupName" label="分组名称" min-width="100" show-overflow-tooltip> </el-table-column>
                            <el-table-column
                                prop="suitableFundGroup"
                                label="适用产品组"
                                show-overflow-tooltip
                                v-if="cutInfo == '动态条目组'"
                                :formatter="transferSuitableFundGroup"
                                min-width="120"
                            >
                            </el-table-column>
                            <el-table-column
                                prop="suitableEntryTags"
                                label="适用标签"
                                min-width="120"
                                show-overflow-tooltip
                                v-if="cutInfo == '动态条目组'"
                                :formatter="transferSuitableEntryTags"
                            >
                            </el-table-column>
                            <el-table-column prop="modifyUser" label="更新人" min-width="120" show-overflow-tooltip></el-table-column>
                            <el-table-column prop="modifyDate" label="更新时间" min-width="160" show-overflow-tooltip>
                                <template slot-scope="scope">
                                    {{ dateFormat(scope.row.modifyDate) }}
                                    {{ timeFormat(scope.row.modifyTime) }}
                                </template>
                            </el-table-column>
                            <el-table-column prop="createUser" label="创建人" min-width="120" show-overflow-tooltip></el-table-column>
                            <el-table-column prop="modifyDate" label="创建时间" min-width="160" show-overflow-tooltip>
                                <template slot-scope="scope">
                                    {{ dateFormat(scope.row.createDate) }}
                                    {{ timeFormat(scope.row.createTime) }}
                                </template>
                            </el-table-column>
                            <el-table-column label="操作" width="150">
                                <template slot-scope="scope">
                                    <RiskIconButton
                                        type="primary"
                                        icon="el-icon-view"
                                        topTitle="查看条目组"
                                        v-authCode="B_0028"
                                        @on-click="openViewGroupDialog(scope.row)"
                                    ></RiskIconButton>
                                    <RiskIconButton
                                        type="primary"
                                        icon="el-icon-edit"
                                        topTitle="编辑条目组"
                                        v-authCode="B_0029"
                                        @on-click="openEditGroupDialog(scope.row)"
                                    ></RiskIconButton>
                                    <RiskIconButton
                                        type="danger"
                                        icon="el-icon-delete"
                                        topTitle="删除条目组"
                                        v-authCode="B_0030"
                                        @on-click="handleGroupRemove(scope.row.groupCode)"
                                    ></RiskIconButton>
                                </template>
                            </el-table-column>
                        </el-table>
                        <div class="block">
                            <el-pagination
                                background
                                @current-change="pageQuery"
                                layout="total, prev, pager, next"
                                :total="groupPage.total"
                                :page-size="groupPage.pageSize"
                                :current-page.sync="groupPage.currentPage"
                            >
                            </el-pagination>
                        </div>
                    </slot>
                </RiskRightModule02>
            </template>

            <template v-else>
                <RiskRightModule02>
                    <p slot="rtitle">条目组明细</p>
                    <span slot="button" class="layout01-r-slot" v-show="indexDetailDiff == '1'" :key="detailNumKey + 'detailNumKey'">
                        <el-button type="primary" size="mini" v-authCode.show="B_0033" @click="queryDetailVisible = true">查询</el-button>
                        <el-button type="primary" size="mini" v-authCode.show="B_0032" @click="openEditDetailDialog" v-if="showBut">编辑</el-button>
                        <el-button type="danger" size="mini" v-authCode.show="B_0034" @click="handleDetailRemove(-1)" v-if="showBut">删除</el-button>
                    </span>
                    <slot>
                        <el-table
                            :data="groupDetailData"
                            @selection-change="handleSelectionDetailChange"
                            v-table-top="groupDetailPage.currentPage"
                            border
                            :header-cell-style="{ background: '#f5f9fc', borderColor: '#d7d7d7', fontSize: '10px', fontWeight: '500' }"
                            :row-class-name="tableRowColor"
                            highlight-current-row
                            highlight-hover-row
                            size="mini"
                            style="width: 100%"
                            height="calc(100vh - 140px)"
                            :key="detailNumKey + 'detailNumKey'"
                        >
                            <el-table-column type="selection" width="55" size="mini" :selectable="selectDisabled"> </el-table-column>
                            <el-table-column prop="entryCode" label="条目编号" width="150" show-overflow-tooltip> </el-table-column>
                            <el-table-column prop="entryName" label="风险说明" width="150" show-overflow-tooltip> </el-table-column>
                            <el-table-column
                                prop="entryType"
                                label="风险类型"
                                width="120"
                                :formatter="(row, column) => Invest.entryType[row.entryType]"
                                show-overflow-tooltip
                            >
                            </el-table-column>
                            <el-table-column
                                prop="riskCalTypes"
                                label="作用范围"
                                min-width="100"
                                :formatter="formatRiskCalTypes"
                                show-overflow-tooltip
                            ></el-table-column>
                            <el-table-column prop="entryStatusValid" label="条目状态" width="120" :formatter="formatStatus" show-overflow-tooltip>
                            </el-table-column>
                            <el-table-column
                                prop="controlGrade"
                                label="条目级别"
                                width="100"
                                :formatter="(row, column) => dict.ControlGrade[row.controlGrade]"
                                show-overflow-tooltip
                            >
                            </el-table-column>
                            <el-table-column prop="entryTagIds" label="条目标签" width="100" show-overflow-tooltip v-if="indexDetailDiff == '0'">
                                <template slot-scope="scope">
                                    {{ scope.row.entryTagIds ? scope.row.entryTagIds.join(',') : '' }}
                                </template>
                            </el-table-column>
                            <el-table-column
                                prop="originalAccountId"
                                label="账户层次"
                                width="100"
                                show-overflow-tooltip
                                v-if="indexDetailDiff == '0'"
                            >
                                <template slot-scope="scope">
                                    {{ DictionConstUtil.RemoldOriginalAccountType[scope.row.originalAccountId] }}
                                </template>
                            </el-table-column>
                            <el-table-column
                                prop="accountControlType"
                                label="控制类型"
                                width="100"
                                show-overflow-tooltip
                                v-if="indexDetailDiff == '0'"
                            >
                                <template slot-scope="scope">
                                    {{ DictionConstUtil.RemoldAccountControlType[scope.row.accountControlType] }}
                                </template>
                            </el-table-column>
                            <el-table-column
                                prop="accountControlValue"
                                label="控制账户"
                                width="100"
                                show-overflow-tooltip
                                v-if="indexDetailDiff == '0'"
                            >
                                <template slot-scope="scope">
                                    {{ scope.row.accountControlValue ? scope.row.accountControlValue.join(',') : '' }}
                                </template>
                            </el-table-column>
                            <el-table-column
                                prop="accountDebarValue"
                                label="排除账户"
                                width="100"
                                show-overflow-tooltip
                                v-if="indexDetailDiff == '0'"
                            >
                                <template slot-scope="scope">
                                    {{ scope.row.accountDebarValue ? scope.row.accountDebarValue.join(',') : '' }}
                                </template>
                            </el-table-column>
                            <el-table-column
                                prop="accountGroupDebarValue"
                                label="排除账户组"
                                width="100"
                                show-overflow-tooltip
                                v-if="indexDetailDiff == '0'"
                            >
                                <template slot-scope="scope">
                                    {{ scope.row.accountGroupDebarValue ? scope.row.accountGroupDebarValue.join(',') : '' }}
                                </template>
                            </el-table-column>
                            <el-table-column label="操作" width="120" v-if="indexDetailDiff == '1'">
                                <template slot-scope="scope">
                                    <RiskIconButton
                                        type="danger"
                                        icon="el-icon-delete"
                                        topTitle="删除"
                                        :disabled="computedAuth || !showBut"
                                        @on-click="handleDetailRemove(scope.row.entryCode)"
                                    ></RiskIconButton>
                                </template>
                            </el-table-column>
                        </el-table>
                        <div class="block">
                            <el-pagination
                                background
                                @current-change="pageQueryDetail"
                                layout="total, prev, pager, next"
                                :total="groupDetailPage.total"
                                :page-size="groupDetailPage.pageSize"
                                :current-page.sync="groupDetailPage.currentPage"
                            >
                            </el-pagination>
                        </div>
                    </slot>
                </RiskRightModule02>
            </template>
        </div>

        <!-- 新增\编辑\查看条目组信息 -->
        <yh-dialog
            :title="groupDialogVO.title"
            :visible.sync="groupDialogVO.visible"
            width="500px"
            drag
            :close-on-click-modal="false"
            :close-on-press-escape="false"
        >
            <el-form label-width="120px" size="mini" ref="groupForm">
                <el-form-item label="分组编码">
                    <el-input style="width: 320px" placeholder="自动生成" v-model="groupForm.groupCode" disabled></el-input>
                </el-form-item>
                <el-form-item label="分组名称">
                    <el-input style="width: 320px" v-model="groupForm.groupName" @input="limitGroupNameInput"></el-input>
                </el-form-item>
                <el-form-item label="适用产品组" v-if="cutInfo == '动态条目组'">
                    <el-select style="width: 320px" v-model="groupForm.suitableFundGroup" multiple collapse-tags filterable>
                        <el-option
                            v-for="item in computedFundGroups1"
                            :key="item.fundGroupCode"
                            :value="item.fundGroupCode"
                            :label="item.fundGroupCode + ' ' + item.fundGroupName"
                        >
                        </el-option>
                    </el-select>
                </el-form-item>
                <el-form-item label="适用标签" v-if="cutInfo == '动态条目组'">
                    <el-select style="width: 320px" v-model="groupForm.suitableEntryTags" multiple collapse-tags filterable>
                        <el-option v-for="item in computedTagGroups1" :key="item.dictKey" :value="item.dictKey" :label="item.dictKeyName"></el-option>
                    </el-select>
                </el-form-item>
                <el-form-item label="创建者">
                    <el-input style="width: 320px" v-model="groupForm.createUser" disabled></el-input>
                </el-form-item>
                <el-form-item label="创建日期">
                    <el-input style="width: 320px" v-model="groupForm.modifyDateshow" disabled></el-input>
                </el-form-item>
            </el-form>
            <div slot="footer" class="dialog-footer">
                <el-button size="mini" @click="closeGroupDialog"> 取 消 </el-button>
                <el-button v-if="groupDialogVO.action != 0" size="mini" type="primary" @click="submitGroupForm" key=""> 确 定 </el-button>
            </div>
        </yh-dialog>
        <!-- 删除 -->
        <yh-dialog
            title="确定删除以下条目组信息吗？"
            :visible.sync="delVisible"
            width="500px"
            drag
            :close-on-click-modal="false"
            :close-on-press-escape="false"
        >
            <div class="remove-text">
                <span> {{ delGroupCodeList.join(' , ') }}</span>
            </div>
            <div slot="footer" class="dialog-footer">
                <el-button size="mini" @click="delVisible = false">取 消</el-button>
                <el-button size="mini" type="primary" @click="delGroup" v-loading="delLoading">确 定</el-button>
            </div>
        </yh-dialog>

        <!-- 查询 -->
        <yh-dialog title="查询条目组" :visible.sync="queryVisible" width="500px" drag :close-on-click-modal="false" :close-on-press-escape="false">
            <el-form label-width="120px" size="mini" ref="queryForm" :model="queryForm">
                <el-form-item label="分组编码" prop="groupCode">
                    <el-input style="width: 220px" v-model="queryForm.groupCode"></el-input>
                </el-form-item>
                <el-form-item label="分组名称" prop="groupName">
                    <el-input style="width: 220px" v-model="queryForm.groupName"></el-input>
                </el-form-item>
                <el-form-item label="适用产品组" v-if="cutInfo == '动态条目组'" prop="suitableFundGroup">
                    <el-select style="width: 220px" v-model="queryForm.suitableFundGroup" multiple collapse-tags filterable>
                        <el-option
                            v-for="item in computedFundGroups2"
                            :key="item.fundGroupCode"
                            :value="item.fundGroupCode"
                            :label="item.fundGroupCode + ' ' + item.fundGroupName"
                        >
                        </el-option>
                    </el-select>
                </el-form-item>
                <el-form-item label="适用标签" v-if="cutInfo == '动态条目组'" prop="suitableEntryTags">
                    <el-select style="width: 220px" v-model="queryForm.suitableEntryTags" multiple collapse-tags filterable>
                        <el-option v-for="item in computedTagGroups2" :key="item.dictKey" :value="item.dictKey" :label="item.dictKeyName"></el-option>
                    </el-select>
                </el-form-item>
                <el-form-item label="更新日期" prop="modifyDate" v-if="cutInfo == '非动态条目组'">
                    <el-date-picker style="width: 220px" v-model="queryForm.modifyDate" type="date" value-format="yyyyMMdd" placeholder="选择日期">
                    </el-date-picker>
                </el-form-item>
            </el-form>
            <div slot="footer" class="dialog-footer">
                <el-button size="mini" @click="queryVisible = false">取 消</el-button>
                <el-button size="mini" @click="resetGroupForm">重 置</el-button>
                <el-button size="mini" type="primary" @click="searchGroup" v-loading="delLoading">确 定</el-button>
            </div>
        </yh-dialog>

        <!-- 编辑 -->
        <div>
            <yh-dialog
                title=""
                :visible.sync="updateDetailVisible"
                width="800px"
                v-loading="loading"
                class="editDialog"
                drag
                :close-on-click-modal="false"
                :close-on-press-escape="false"
            >
                <div style="min-height: 450px">
                    <RiskTrantableInline2
                        leftPlaceholder="编码/名称"
                        rightPlaceholder="编码/名称"
                        :columns="tranColumns"
                        :rightTableData="rightTranData"
                        :searchNames="['entryCode', 'entryName']"
                        indexKey="entryCode"
                        ref="tranTable"
                        sort="entryName"
                        url="/entry/list/CodeOrName"
                        v-if="updateDetailVisible"
                    />
                </div>
                <div slot="footer" class="dialog-footer">
                    <el-button size="mini" @click="updateDetailVisible = false"> 取 消 </el-button>
                    <el-button size="mini" type="primary" @click="updateDetail">确 定 </el-button>
                </div>
            </yh-dialog>
        </div>
        <!-- 删除 -->
        <div>
            <yh-dialog
                title="确定删除以下条目组明细信息吗？"
                :visible.sync="delDetailVisible"
                width="500px"
                drag
                :close-on-click-modal="false"
                :close-on-press-escape="false"
            >
                <div class="remove-text">
                    <span> {{ delEntryCodeList.join(' , ') }}</span>
                </div>
                <div slot="footer" class="dialog-footer">
                    <el-button size="mini" @click="delDetailVisible = false">取 消</el-button>
                    <el-button size="mini" type="primary" @click="delDetail">确 定</el-button>
                </div>
            </yh-dialog>
        </div>

        <!-- 查询条目组明细 -->
        <div>
            <yh-dialog
                title="查询条目组明细"
                :visible.sync="queryDetailVisible"
                width="500px"
                drag
                :close-on-click-modal="false"
                :close-on-press-escape="false"
            >
                <el-form label-width="120px" size="mini" ref="queryDetailForm" :model="queryDetailForm">
                    <el-form-item label="条目编号" prop="entryCode">
                        <el-input style="width: 220px" v-model="queryDetailForm.entryCode"></el-input>
                    </el-form-item>
                    <el-form-item label="风险说明" prop="entryName">
                        <el-input style="width: 220px" v-model="queryDetailForm.entryName"></el-input>
                    </el-form-item>
                    <el-form-item label="风险类型" prop="entryType">
                        <el-select style="width: 220px" v-model="queryDetailForm.entryType" clearable>
                            <el-option
                                v-for="item in entryTypes"
                                :key="item.dictKey"
                                :label="item.dictKey + '' + item.dictKeyName"
                                :value="item.dictKey"
                            >
                            </el-option>
                        </el-select>
                    </el-form-item>
                </el-form>
                <div slot="footer" class="dialog-footer">
                    <el-button size="mini" @click="queryDetailVisible = false">取 消</el-button>
                    <el-button size="mini" @click="resetGroupDetailForm">重 置</el-button>
                    <el-button size="mini" type="primary" @click="searchGroupDetail" v-loading="delLoading">确 定</el-button>
                </div>
            </yh-dialog>
        </div>
    </div>
</template>
<script lang="ts">
import { Component, Vue, Watch } from 'vue-property-decorator';
import RiskLeftModule02 from '@/common/components/risk-left-module02.vue';
import RiskRightModule02 from '@/common/components/risk-right-module02.vue';
import RiskIconButton from '@/common/components/risk-icon-button.vue';
import RiskTable from '@/common/components/risk-table.vue';
import { DialogVO } from '@yhfin/biz';
import { changeOptions, dateFormat, getCurrentPageData, timeFormat } from '@/utils/tools';
import XEUtils from 'xe-utils';
import { getUser } from '@/utils/user-util';
import Invest from '@/common/dict/invest';
import DictionConstUtil, { objToArr } from '@/utils/diction-const-util';
import Index from '@/pages/setting/dict';
import RiskTrantableInline2 from './item-group-setting/risk-trantable-inline2.vue';

export interface pages {
    total?: number;
    pageSize?: number;
    currentPage?: number;
}
@Component({
    name: 'ItemGroupSetting',
    components: {
        RiskLeftModule02,
        RiskRightModule02,
        RiskIconButton,
        RiskTable,
        RiskTrantableInline2,
    },
})
export default class ItemGroupSetting extends Vue {
    dateFormat = dateFormat;
    timeFormat = timeFormat;

    private leftplaceHolder: string = '编号/名称';
    private leftKey: string = '';
    private leftHgt: string = '100vh';
    private showBut: boolean = true;
    private CurrentNodeKey: string = '0';

    private cutInfo: string = '动态条目组';
    private groupCode: string = '';
    private treeData: any = [
        {
            label: '动态条目组',
            id: '0',
            children: [],
        },
        {
            label: '非动态条目组',
            id: '1',
            children: [],
        },
    ];

    private groupData: any[] = [];
    private groupDetailData: any[] = [];
    private groupDataList: any[] = [];
    private groupDetailDataList: any[] = [];
    private resultGroupData: any[] = [];
    private resultGroupDetailData: any[] = [];
    private selectedGroupCodeList: string[] = [];
    private selectedEntryCodeList: string[] = [];

    private delGroupCodeList: string[] = [];
    private delEntryCodeList: string[] = [];

    private indexDetailDiff: string = ''; // 区分条目组

    private detailNumKey: number = -1; // 单个条目组右侧渲染
    private groupPage: pages = {
        total: 0,
        pageSize: 25,
        currentPage: 1,
    };

    private groupDetailPage: pages = {
        total: 0,
        pageSize: 25,
        currentPage: 1,
    };
    private groupDialogVO: DialogVO = new DialogVO();
    private delVisible: boolean = false;
    private delDetailVisible: boolean = false;
    private queryVisible: boolean = false;
    private queryDetailVisible: boolean = false;
    private updateDetailVisible: boolean = false;

    private groupFormModal = {
        groupCode: '',
        groupName: '',
        modifyDate: XEUtils.toDateString(new Date(), 'yyyyMMdd'),
        createUser: getUser().userNickName,
        userCode: '',
        modifyDateshow: XEUtils.toDateString(new Date(), 'yyyy-MM-dd'),
    };

    private groupForm: any = {};

    private dynamicGroupFormModal = {
        groupCode: '',
        groupName: '',
        modifyDate: XEUtils.toDateString(new Date(), 'yyyyMMdd'),
        createUser: getUser().userNickName,
        // userCode: '',
        suitableEntryTags: [],
        suitableFundGroup: [],
    };

    private groupEditForm = {
        checkUserNickName: '',
        createUser: '',
        groupCode: '',
        groupName: '',
        modifyDate: 0,
        modifyTime: 0,
        userCode: '',
    };

    private queryForm: any = {};

    private queryDynamicModel = {
        groupCode: '',
        groupName: '',
        modifyDate: '',
    };

    private queryStaticModel = {
        groupCode: '',
        groupName: '',
        suitableFundGroup: [],
        suitableEntryTags: [],
    };

    private queryDetailForm = {
        entryCode: '',
        entryName: '',
        entryType: '',
    };

    // 穿梭框数据
    private tranColumns: any[] = [
        {
            label: '条目编号',
            prop: 'entryCode',
            width: 80,
        },
        {
            label: '风险说明',
            prop: 'entryName',
        },
    ];
    private rightTranData: any[] = [];
    private entryCodeList: string[] = [];
    private Invest: any = new Invest();
    private dict: any = new Index();
    private entryTypes: any[] = [];

    private fundGroups: any[] = []; // 下拉产品组

    private tagGroups: any[] = []; // 适用标签组

    private queryDynamicTermParam = {
        groupCode: '',
        groupName: '',
        paging: {
            currentPage: 0,
            pageSize: 0,
        },
        suitableEntryTags: [],
        suitableFundGroup: [],
    };
    private groupDataNumKey: number = -1;

    private DictionConstUtil = DictionConstUtil; // 字典类

    async mounted() {
        // 获取适用产品组下拉框、适用标签组
        // this.fundGroups = (await DictionConstUtil.FNFundGroup()) || [];
        this.getFundGroupList();
        this.getTagGroups();

        this.getDynamicGroupTreeList();
        this.getGroupTreeList();

        this.queryDynamicTerm(1);
        this.entryTypes = objToArr(this.Invest.entryType);
    }

    get computedAuth() {
        const resources = getUser().resources;
        if (!resources || !resources.length) {
            return true;
        }
        const itemValue = resources.find(item => {
            return item.resourceCode === 'B_0034';
        });
        return !itemValue;
    }

    // 适用产品组
    get computedFundGroups1() {
        if (this.groupForm.suitableFundGroup && this.groupForm.suitableFundGroup?.length) {
            let fundGroups = changeOptions(this.groupForm.suitableFundGroup, this.fundGroups, 'fundGroupCode');
            return fundGroups;
        } else {
            return this.fundGroups;
        }
    }

    get computedFundGroups2() {
        if (this.queryForm.suitableFundGroup && this.queryForm.suitableFundGroup?.length) {
            let fundGroups = changeOptions(this.queryForm.suitableFundGroup, this.fundGroups, 'fundGroupCode');
            return fundGroups;
        } else {
            return this.fundGroups;
        }
    }

    get computedTagGroups1() {
        if (this.groupForm.suitableEntryTags && this.groupForm.suitableEntryTags?.length) {
            let tagGroups = changeOptions(this.groupForm.suitableEntryTags, this.tagGroups, 'dictKey');
            return tagGroups;
        } else {
            return this.tagGroups;
        }
    }

    get computedTagGroups2() {
        if (this.queryForm.suitableEntryTags && this.queryForm.suitableEntryTags?.length) {
            let tagGroups = changeOptions(this.queryForm.suitableEntryTags, this.tagGroups, 'dictKey');
            return tagGroups;
        } else {
            return this.tagGroups;
        }
    }

    // 获取适用产品组下拉框、适用标签组
    private getFundGroupList(): void {
        this.$axios.post('/fundGroup/list').then((res: any) => {
            this.fundGroups = res;
        });
    }

    // 左边栏选择节点
    private clickNode(data: any): void {
        console.log(data, 'data');
        if (data.id == 'DEFAULT') {
            this.showBut = false;
        } else {
            this.showBut = true;
        }
        this.cutInfo = data.label;
        this.groupCode = data.id;
        if (this.cutInfo == '动态条目组') {
            this.queryDynamicTerm(1);
        } else if (this.cutInfo == '非动态条目组') {
            this.queryGroupList(this.groupPage);
        } else {
            this.indexDetailDiff = data.index;
            this.detailNumKey++;
            // console.log(data.index, 'index');

            data.index == '0' ? this.queryDynamicTermDetail(1) : this.queryGroupDetailList();
        }
    }

    // 获取适用标签组
    private getTagGroups(): void {
        this.$axios.get('/entryTag/queryAll').then((res: any) => {
            this.tagGroups = res;
        });
    }

    // 适用产品组转义
    private transferSuitableFundGroup(column) {
        let retValue = [];
        if (this.cutInfo == '动态条目组' && column.suitableFundGroup && column.suitableFundGroup.length > 0) {
            column.suitableFundGroup.forEach((ele, index) => {
                let value = this.fundGroups.find(item => item.fundGroupCode == ele);
                retValue.push(ele + ' ' + value.fundGroupName);
            });
        }
        return retValue.join(',');
    }

    // 适用标签转义
    private transferSuitableEntryTags(column) {
        let retValue = [];
        if (this.cutInfo == '动态条目组' && column.suitableEntryTags && column.suitableEntryTags.length > 0) {
            column.suitableEntryTags.forEach((ele, index) => {
                let value = this.tagGroups.find(item => item.dictKey == ele);
                retValue.push(ele + ' ' + value.dictKeyName);
            });
        }

        return retValue.join(',');
    }

    // 标签名称输入框
    private limitGroupNameInput(value): void {
        let subject = value.replace(/[^\u4E00-\u9FA5\\a-z\\A-\\Z0-9 ]/g, '');
        this.groupForm.groupName = subject;
    }

    selectDisabled(row) {
        return this.showBut;
        // if (this.showBut) {
        //     return false;
        // } else {
        //     return true;
        // }
    }

    /* *********************** 条目组相关 start ********************* */

    // 显示新增条目组弹框
    private openAddGroupDialog() {
        if (this.cutInfo == '动态条目组') {
            this.groupForm = JSON.parse(JSON.stringify(this.dynamicGroupFormModal));
        } else {
            this.groupForm = JSON.parse(JSON.stringify(this.groupFormModal));
        }
        this.groupDialogVO = this.groupDialogVO.getAddDialog('新增条目组信息');
    }

    /* *********************** 动态条目组相关 start ********************* */
    // 获取动态条目组
    private getDynamicGroupTreeList(): void {
        this.$axios
            .get('/maxWealth/dynamicGroup/getAllGroup')
            .then((res: any) => {
                let nodeDatas = [];
                for (let item of res) {
                    let datas = item.dictKey + '-' + item.dictKeyName;
                    nodeDatas.push({ data: item, label: datas, id: item.dictKey, index: '0' });
                }
                this.treeData[0].children = nodeDatas;
            })
            .catch(e => {
                console.log(e);
            });
    }

    // 获取动态表格
    private queryDynamicTerm(cur: number): void {
        this.queryDynamicTermParam.paging.currentPage = cur;
        this.$axios
            .post('/maxWealth/dynamicGroup/list', this.queryDynamicTermParam)
            .then((res: any) => {
                this.groupData = res.list;
                this.groupPage.total = res.total;
                this.groupDataNumKey++;
            })
            .catch(e => {
                console.log(e);
            });
    }

    // 获取动态表格明细
    private queryDynamicTermDetail(cur: number) {
        this.$axios
            .post('/maxWealth/dynamicGroup/getGroupEntry', {
                groupCode: this.groupCode,
                paging: {
                    currentPage: cur,
                    pageSize: 25,
                },
            })
            .then((res: any) => {
                this.groupDetailData = res.list;
                this.groupDetailPage.total = res.total;
            })
            .catch(e => {
                console.log(e);
            });
    }

    /* *********************** 条目组相关 start ********************* */

    // 仅获取树形结构
    private getGroupTreeList(): void {
        // this.$axios.get('/entry/group/list').then((res: any) => {
        this.$axios.get('/entry/group/notDynamic/list').then((res: any) => {
            let nodeDatas = [];
            for (let item of res) {
                let datas = item.groupCode + '-' + item.groupName;
                nodeDatas.push({ data: item, label: datas, id: item.groupCode, index: '1' });
            }
            this.treeData[1].children = nodeDatas;
        });
    }

    // 获取条目组列表
    private queryGroupList(page: pages) {
        this.$axios.get('/entry/group/notDynamic/list').then((res: any) => {
            // this.$axios.get('/entry/group/list').then((res: any) => {
            let nodeDatas = [];
            for (let item of res) {
                let datas = item.groupCode + '-' + item.groupName;
                nodeDatas.push({ data: item, label: datas, id: item.groupCode, index: '1' });
            }
            this.treeData[1].children = nodeDatas;
            this.groupDataList = res;
            this.groupPage.total = res.length;
            this.groupData = getCurrentPageData(this.groupDataList, this.groupPage.currentPage, this.groupPage.pageSize);
            this.groupDataNumKey++;
        });
    }

    // 按钮查询
    private handleSearch() {
        if (this.cutInfo == '动态条目组') {
            this.queryForm = JSON.parse(JSON.stringify(this.queryDynamicModel));
        } else {
            this.queryForm = JSON.parse(JSON.stringify(this.queryStaticModel));
        }
        this.queryVisible = true;
    }

    // 表格斑马线
    tableRowColor({ row, rowIndex }) {
        if (rowIndex % 2 == 0) {
            return 'statistics-warning-row';
        } else {
            return 'tow-table-row';
        }
    }

    // 查询条目组
    private searchGroup() {
        if (this.cutInfo == '动态条目组') {
            this.queryDynamicTermParam = {
                ...JSON.parse(JSON.stringify(this.queryForm)),
                paging: {
                    currentPage: 1,
                    pageSize: 25,
                },
            };
            this.queryDynamicTerm(1);
        } else {
            this.resultGroupData = this.handleFilter(this.groupDataList, this.queryForm);
            this.groupPage.total = this.resultGroupData.length;
            this.groupData = getCurrentPageData(this.resultGroupData, this.groupPage.currentPage, this.groupPage.pageSize);
        }
        this.groupDataNumKey++;
        this.queryVisible = false;
    }

    // 条目组筛选数据
    private handleFilter(dataSource: any, param: any): any {
        if (!dataSource) {
            return dataSource;
        } else {
            return dataSource.filter(
                (item: any) =>
                    (item.groupCode || '').toUpperCase().includes(param.groupCode.toUpperCase()) &&
                    (item.groupName || '').toUpperCase().includes(param.groupName.toUpperCase()) &&
                    [item.modifyDate, 0].includes(parseInt(param.modifyDate) ? parseInt(param.modifyDate) : 0)
            );
        }
    }

    // 重置条目组查询表单
    private resetGroupForm() {
        (this.$refs.queryForm as any).resetFields();
    }

    // 条目组分页
    private pageQuery(val: number) {
        if (this.cutInfo == '动态产品组') {
            this.queryDynamicTerm(1);
        } else {
            this.currentChange(val);
        }
    }

    // 条目组分页
    private currentChange(val: number): void {
        this.groupPage.currentPage = val;
        this.groupData = getCurrentPageData(this.groupDataList, this.groupPage.currentPage, this.groupPage.pageSize);
        this.groupDataNumKey++;
    }

    // 显示编辑条目组弹框
    private openEditGroupDialog(val: any) {
        // this.groupEditForm = JSON.parse(JSON.stringify(val));
        // this.groupForm.groupCode = val.groupCode;
        // this.groupForm.groupName = val.groupName;
        this.groupForm = JSON.parse(JSON.stringify(val));
        this.groupDialogVO = this.groupDialogVO.getUpdateDialog('编辑条目组信息');
    }

    // 显示查看条目组弹框
    private openViewGroupDialog(val: any) {
        // this.groupForm.groupCode = val.groupCode;
        // this.groupForm.groupName = val.groupName;
        this.groupDialogVO = this.groupDialogVO.getSeeDialog('查看条目组信息');
        this.groupForm = JSON.parse(JSON.stringify(val));
    }

    // 关闭弹框
    private closeGroupDialog() {
        this.groupDialogVO.visible = false;
        this.groupForm.groupCode = '';
        this.groupForm.groupName = '';
    }

    // 新增条目组
    private insertGroup() {
        this.$axios.post('/entry/group/insert', this.groupForm).then((res: any) => {
            this.closeGroupDialog();
            this.queryGroupList(this.groupPage);
            this.yh_message_success('新增成功');
        });
    }

    // 编辑条目组
    private updateGroup() {
        // this.groupEditForm.groupCode = this.groupForm.groupCode;
        // this.groupEditForm.groupName = this.groupForm.groupName;
        this.$axios.post('/entry/group/update', this.groupForm).then((res: any) => {
            this.closeGroupDialog();
            this.queryGroupList(this.groupPage);
            this.yh_message_success('更新成功');
        });
    }

    /**
     * 获得字符串实际长度，中文2，英文1
     */
    getByteLength(str) {
        let realLength = 0;
        let len = str.length;
        let charCode = -1;
        for (let i = 0; i < len; i++) {
            charCode = str.charCodeAt(i);
            if (charCode >= 0 && charCode <= 128) realLength += 1;
            else realLength += 2;
        }
        return realLength;
    }

    // 提交表单
    private submitGroupForm() {
        if (!this.groupForm.groupName || this.groupForm.groupName.length === 0) {
            this.yh_message_warn('分组名称不能空！');
            return;
        }

        if (this.getByteLength(this.groupForm.groupName) > 100) {
            this.yh_message_warn('分组名称长度不能大于100个字符！');
            return;
        }

        if (this.cutInfo == '动态条目组') {
            this.groupDialogVO.action === 1 ? this.insertDynamicGroup() : this.updateDynamicGroup();
        } else {
            this.groupDialogVO.action === 1 ? this.insertGroup() : this.updateGroup();
        }
    }

    // 新增条目组
    private insertDynamicGroup(): void {
        this.$axios
            .post('/maxWealth/dynamicGroup/add', this.groupForm)
            .then((res: any) => {
                this.yh_message_success('新增成功');
                this.queryDynamicTerm(1);
                this.getDynamicGroupTreeList();
                this.groupDialogVO.visible = false;
            })
            .catch(e => {
                this.groupDialogVO.visible = false;
            });
    }

    // 修改条目组
    private updateDynamicGroup(): void {
        this.$axios
            .post('/maxWealth/dynamicGroup/update', this.groupForm)
            .then((res: any) => {
                this.yh_message_success('修改成功');
                this.queryDynamicTerm(1);
                this.getDynamicGroupTreeList();
                this.groupDialogVO.visible = false;
            })
            .catch(e => {
                this.groupDialogVO.visible = false;
            });
    }

    // 获取条目组表格勾选数据
    private handleSelectionChange(val: any) {
        this.selectedGroupCodeList = [];
        for (var i in val) {
            this.selectedGroupCodeList.push(val[i].groupCode);
        }
    }

    // 判断删除类型
    private handleGroupRemove(val: any) {
        if (val === -1) {
            if (!this.selectedGroupCodeList || this.selectedGroupCodeList.length < 1) {
                this.yh_message_warn('未选择删除项');
                return;
            }
            this.delGroupCodeList = this.selectedGroupCodeList;
        } else {
            this.delGroupCodeList = [];
            this.delGroupCodeList.push(val);
        }
        this.delVisible = true;
    }

    // 删除条目组
    private delGroup() {
        if (this.cutInfo == '动态条目组') {
            // 动态条目组
            this.$axios
                .post('/maxWealth/dynamicGroup/delete', this.delGroupCodeList)
                .then((res: any) => {
                    this.queryDynamicTerm(1);
                    this.getDynamicGroupTreeList();
                    this.delVisible = false;
                    this.yh_message_success('删除成功');
                })
                .catch(e => {
                    console.log(e);
                });
        } else {
            this.$axios({
                url: '/entry/group/delete',
                method: 'POST',
                data: this.delGroupCodeList,
            }).then(res => {
                this.yh_message_success('删除成功');
                this.queryGroupList(this.groupPage);
                this.delVisible = false;
            });
        }
    }

    /* *********************** 条目组明细相关 start ********************* */

    // 获取条目组明细列表
    private queryGroupDetailList() {
        this.$axios.get('/entry/group/query/detail/' + this.groupCode).then((res: any) => {
            this.groupDetailDataList = res;
            this.rightTranData = res;
            this.resultGroupDetailData = res;
            this.groupDetailPage.total = res.length;
            this.groupDetailData = getCurrentPageData(this.groupDetailDataList, this.groupDetailPage.currentPage, this.groupDetailPage.pageSize);
        });
    }

    // 条目状态列转换
    private formatStatus(row): string {
        return row.entryStatusValid ? '启用' : '禁用';
    }

    // 作用范围列转换
    private formatRiskCalTypes(row) {
        let show = [];
        for (const item of row.riskCalTypes) {
            show.push(this.dict.RiskCalType[item]);
        }
        return show;
    }

    // 查询条目组明细
    private searchGroupDetail() {
        console.log(this.queryDetailForm, 'queryDetailForm');
        this.resultGroupDetailData = this.handleFilterDetail(this.groupDetailDataList, this.queryDetailForm);
        this.groupDetailPage.total = this.resultGroupDetailData.length;
        this.groupDetailData = getCurrentPageData(this.resultGroupDetailData, this.groupDetailPage.currentPage, this.groupDetailPage.pageSize);
        this.queryDetailVisible = false;
    }

    // 条目组明细筛选数据
    private handleFilterDetail(dataSource: any, param: any): any {
        if (!dataSource) {
            return dataSource;
        } else {
            return dataSource.filter(
                (item: any) =>
                    (item.entryCode || '').toUpperCase().includes(param.entryCode.toUpperCase()) &&
                    (item.entryName || '').toUpperCase().includes(param.entryName.toUpperCase()) &&
                    (item.entryType || '').toUpperCase().includes(param.entryType.toUpperCase())
            );
        }
    }

    // 重置条目组查询表单
    private resetGroupDetailForm() {
        (this.$refs.queryDetailForm as any).resetFields();
    }

    private pageQueryDetail(val: number) {
        if (this.indexDetailDiff == '0') {
            this.queryDynamicTermDetail(val);
        } else {
            this.currentDetailChange(val);
        }
    }

    // 条目组明细分页
    private currentDetailChange(val: number): void {
        this.groupDetailPage.currentPage = val;
        this.groupDetailData = getCurrentPageData(this.groupDetailDataList, this.groupDetailPage.currentPage, this.groupDetailPage.pageSize);
    }
    // 显示条目组明细编辑弹框
    private openEditDetailDialog() {
        this.queryEntryList();
        this.updateDetailVisible = true;
    }

    // 获取条目信息
    private queryEntryList() {
        this.updateDetailVisible = true;
        // this.$axios
        //     .post('/entry/list/CodeOrName', {
        //         codeOrName: '',
        //         entryType: '',
        //         paging: {
        //             currentPage: 1,
        //             pageSize: 25,
        //         },
        //         filterEntryCode: this.groupDetailData.map((item: any) => item.entryCode),
        //     })
        //     .then((res: any) => {
        //         let a = res.list;
        //         for (let i = 0; i < a.length; i++) {
        //             a[i].id = a[i].entryCode;
        //         }
        //         this.leftTranData = a;
        //     });
    }

    // 编辑条目组明细
    private updateDetail() {
        this.entryCodeList = [];
        const rightData = (this.$refs.tranTable as any).getRightAllData();
        rightData.map((item: any) => {
            this.entryCodeList.push(item.entryCode);
        });
        this.$axios.post('/entry/group/edit/detail/' + this.groupCode, this.entryCodeList).then((res: any) => {
            this.queryGroupDetailList();
            this.yh_message_success('更新成功');
            this.updateDetailVisible = false;
        });
    }

    // 获取条目组明细表格勾选数据
    private handleSelectionDetailChange(val: any) {
        this.selectedEntryCodeList = [];
        for (var i in val) {
            this.selectedEntryCodeList.push(val[i].entryCode);
        }
    }

    // 判断条目组删除类型
    private handleDetailRemove(val: any) {
        if (val === -1) {
            if (!this.selectedEntryCodeList || this.selectedEntryCodeList.length < 1) {
                this.yh_message_warn('未选择删除项');
                return;
            }
            this.delEntryCodeList = this.selectedEntryCodeList;
        } else {
            this.delEntryCodeList = [];
            this.delEntryCodeList.push(val);
        }
        this.delDetailVisible = true;
    }

    // 删除条目组明细
    private delDetail() {
        this.$axios({
            url: '/entry/group/delete/detail/multiple/' + this.groupCode,
            method: 'POST',
            data: this.delEntryCodeList,
        }).then(res => {
            this.yh_message_success('删除成功');
            this.queryGroupDetailList();
            this.delDetailVisible = false;
        });
    }

    // 格式化日期
    private formatterDate({ modifyDate }) {
        return dateFormat(modifyDate, true);
    }

    // 格式化时间
    private formatterTime({ modifyTime }) {
        return timeFormat(modifyTime, true);
    }
}
</script>
<style lang="scss" scoped>
/deep/ .el-table .statistics-warning-row {
    background: #fff !important;
}

/deep/ .el-table .tow-table-row {
    background: #f2f6fa !important;
}

/deep/ .el-table__body tr.current-row > td {
    background: #b1d8fb;
}
/deep/ .editDialog .el-dialog {
    margin-top: 10vh !important;
    .el-dialog__body {
        max-height: 90vh;
        padding: 10px;
    }
}
</style>
